﻿<template>
    <el-dialog
        :title="!dataForm.id ? '新建' : '编辑'"
        :close-on-click-modal="false"
        :visible.sync="visible"
        class="SHZY-dialog SHZY-dialog_center"
        lock-scroll
        width="600px"
    >
        <el-row :gutter="15" class="">
            <el-form
                ref="elForm"
                :model="dataForm"
                size="small"
                label-width="100px"
                label-position="right"
                :rules="rules"
            >
                <el-col :span="24">
                    <el-form-item label="单据类型" prop="type">
                        <el-select
                            v-model="dataForm.type"
                            placeholder="请选择"
                            clearable
                            required
                            :style="{ width: '100%' }"
                            filterable
                        >
                            <el-option
                                v-for="(item, index) in typeOptions"
                                :key="index"
                                :label="item.fullName"
                                :value="item.id"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="状态" prop="status">
                        <el-radio-group
                            v-model="dataForm.status"
                            required
                            size="small"
                        >
                            <el-radio-button
                                v-for="(item, index) in statusOptions"
                                :key="index"
                                :label="item.id"
                                >{{ item.fullName }}</el-radio-button
                            >
                        </el-radio-group>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="时间单位" prop="timeUnit">
                        <el-radio-group
                            v-model="dataForm.timeUnit"
                            required
                            size="small"
                        >
                            <el-radio-button
                                v-for="(item, index) in timeUnitOptions"
                                :key="index"
                                :label="item.id"
                                >{{ item.fullName }}</el-radio-button
                            >
                        </el-radio-group>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="时间最小值" prop="minValue">
                        <el-input-number
                            v-model="dataForm.minValue"
                            placeholder="数字文本"
                            required
                            :step="1"
                            :min="0"
                        >
                        </el-input-number>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="时间最大值" prop="maxValue">
                        <el-input-number
                            v-model="dataForm.maxValue"
                            placeholder="数字文本"
                            required
                            :step="1"
                            :min="1"
                        >
                        </el-input-number>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="消息接收人" prop="recipientList">
                        <user-select
                            v-model="dataForm.recipientList"
                            placeholder="请选择"
                            clearable
                            required
                            multiple
                        >
                        </user-select>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="消息模板" prop="messageTemplate">
                        <el-select
                            v-model="dataForm.messageTemplate"
                            placeholder="请选择"
                            clearable
                            required
                            :style="{ width: '100%' }"
                            filterable
                        >
                            <el-option
                                v-for="(item, index) in messageTemplateOptions"
                                :key="index"
                                :label="item.FullName"
                                :value="item.Id"
                            ></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :span="24">
                    <el-form-item label="有效标志" prop="enabledMark">
                        <el-switch
                            v-model="dataForm.enabledMark"
                            required
                            :active-value="1"
                            :inactive-value="0"
                        >
                        </el-switch>
                    </el-form-item>
                </el-col>
            </el-form>
        </el-row>
        <span slot="footer" class="dialog-footer">
            <el-button @click="visible = false">取 消</el-button>
            <el-button
                type="primary"
                @click="dataFormSubmit()"
                :loading="btnLoading"
                >确 定</el-button
            >
        </span>
    </el-dialog>
</template>
<script>
import request from "@/utils/request";
import { getDictionaryDataSelector } from "@/api/systemData/dictionary";
import { getDataInterfaceRes } from "@/api/systemData/dataInterface";
import ApioverdueSetting from "@/api/q1/basedata/overdueSetting";
export default {
    components: {},
    props: [],
    data() {
        return {
            btnLoading: false,
            loading: false,
            visible: false,
            dataForm: {
                id: "",
                type: undefined,
                status: "1",
                timeUnit: "day",
                minValue: 0,
                maxValue: 1,
                recipientList: [],
                messageTemplate: undefined,
                enabledMark: 1
            },
            rules: {
                type: [
                    {
                        required: true,
                        message: "请输入单据类型",
                        trigger: '"change"'
                    }
                ],
                status: [
                    {
                        required: true,
                        message: "请输入状态",
                        trigger: '"change"'
                    }
                ],
                timeUnit: [
                    {
                        required: true,
                        message: "请输入时间单位",
                        trigger: '"change"'
                    }
                ],
                minValue: [
                    {
                        required: true,
                        message: "请输入时间最小值",
                        trigger: ["blur", "change"]
                    }
                ],
                maxValue: [
                    {
                        required: true,
                        message: "请输入时间最大值",
                        trigger: ["blur", "change"]
                    }
                ],
                recipientList: [
                    {
                        required: true,
                        message: "请输入消息接收人",
                        trigger: '"click"'
                    }
                ],
                messageTemplate: [
                    {
                        required: true,
                        message: "请输入消息模板",
                        trigger: '"change"'
                    }
                ],
                enabledMark: [
                    {
                        required: true,
                        message: "请输入有效标志",
                        trigger: "change"
                    }
                ]
            },
            typeOptions: [],
            statusOptions: [
                { fullName: "即将逾期", id: "1" },
                { fullName: "逾期", id: "2" }
            ],
            timeUnitOptions: [
                { fullName: "天", id: "day" },
                { fullName: "小时", id: "hour" },
                { fullName: "分钟", id: "minute" },
                { fullName: "秒", id: "second" }
            ],
            messageTemplateOptions: []
        };
    },
    computed: {},
    watch: {},
    created() {
        this.gettypeOptions();
        this.getmessageTemplate();
    },
    mounted() {},
    methods: {
        gettypeOptions() {
            getDictionaryDataSelector("459581510966602757").then(res => {
                this.typeOptions = res.data.list;
            });
        },
        getmessageTemplate() {
            ApioverdueSetting.getmessageTemplate().then(res => {
                this.messageTemplateOptions = res.data;
            });
        },
        goBack() {
            this.$emit("refresh");
        },
        init(id) {
            this.dataForm.id = id || 0;
            this.visible = true;
            this.$nextTick(() => {
                this.$refs["elForm"].resetFields();
                if (this.dataForm.id) {
                    ApioverdueSetting.getInfo(this.dataForm.id).then(res => {
                        console.log(res.data);
                        this.dataForm = res.data;
                    });
                }
            });
            this.$store.commit("generator/UPDATE_RELATION_DATA", {});
        },
        dataFormSubmit() {
            this.$refs["elForm"].validate(valid => {
                if (valid) {
                    this.btnLoading = true;
                    if (!this.dataForm.id) {
                        ApioverdueSetting.create(this.dataForm)
                            .then(res => {
                                this.$message({
                                    message: res.msg,
                                    type: "success",
                                    duration: 1000,
                                    onClose: () => {
                                        (this.visible = false),
                                            this.$emit("refresh", true);
                                    }
                                });
                            })
                            .catch(res => {
                                this.btnLoading = false;
                            });
                    } else {
                        ApioverdueSetting.update(this.dataForm)
                            .then(res => {
                                this.$message({
                                    message: res.msg,
                                    type: "success",
                                    duration: 1000,
                                    onClose: () => {
                                        this.visible = false;
                                        this.$emit("refresh", true);
                                    }
                                });
                            })
                            .catch(res => {
                                this.btnLoading = false;
                            });
                    }
                }
            });
        }
    }
};
</script>
